<template>
  <div class="wf-input">
    {{ userName }}
  </div>

  <!-- <el-input
    v-model="innerUserName"
    :disabled="true"
  /> -->
</template>
<script>
export default {
  name: 'WfUserName',
  props: {
    userName: {
      type: String,
      default: null
    },
    active: {
      type: Number,
      default: 0
    }
  },
  data() {
    return {
      innerUserName: null
    }
  },
  watch: {
    active(newVal, oldVal) {
      if (!newVal) return
      this.getData()
    }
  },
  created() {
    if (!this.active) return
    this.getData()
  },
  methods: {
    getData() {
      setTimeout(() => {
        var userName = this.$store.state.session.user.name
        this.innerUserName = userName
        this.$emit('update:userName', userName)
      }, 300)
    }
  }
}
</script>
